<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div th:fragment="header">
    <section id="header" class="header">
        <div class="header-top">
            <div class="container">
                <div class="row">
                    <div class="col-md-4">
                        <ul class="flat-support">
                            <li>
                                <a href="/page/doubt" title="">答疑</a>
                            </li>
                            <li>
                                <a  title="">商店位置</a>
                            </li>
                            <li>
                                <a  title="">追踪您的订单</a>
                            </li>
                        </ul><!-- /.flat-support -->
                    </div><!-- /.col-md-4 -->
                    <div class="col-md-4">
                        <ul class="flat-infomation">
                            <li class="phone">
                                致电我们: <a href="#" title="">18696215832</a>
                            </li>
                        </ul><!-- /.flat-infomation -->
                    </div><!-- /.col-md-4 -->
                    <div class="col-md-4">
                        <ul class="flat-unstyled">
                            <li class="account">
                                <a href="#" title="">我的账户<i class="fa fa-angle-down" aria-hidden="true"></i></a>
                                <ul class="unstyled">
                                    <li th:if="${session.current_user} == null">
                                        <a href="/page/loginOrRegister" title="">登录</a>
                                    </li>

                                    <li th:if="${session.current_user} != null">
                                        <a href="/user/info">我的信息</a>
                                        <a href="/user/invalidate">注销</a>
                                    </li>
                                </ul>
                            </li>
                        </ul><!-- /.flat-unstyled -->
                    </div><!-- /.col-md-4 -->
                </div><!-- /.row -->
            </div><!-- /.container -->
        </div><!-- /.header-top -->
        <div class="header-middle">
            <div class="container">
                <div class="row">
                    <div class="col-md-3">
                        <div id="logo" class="logo">
                            <a href="index.html" title="">
                                <img src="/images/logos/logo-ft.png" alt="">
                            </a>
                        </div><!-- /#logo -->
                    </div><!-- /.col-md-3 -->
                    <div class="col-md-6">
                        <div class="top-search">
                            <form action="/page/findFood" method="get" class="form-search" accept-charset="utf-8">
                                <div class="box-search">
                                    <input type="text" name="foodName" placeholder="搜索你想搜索的产品">
                                    <span class="btn-search">
											<button type="submit" class="waves-effect"><img
                                                    src="/images/icons/search.png" alt=""></button>
										</span>
                                </div><!-- /.box-search -->
                            </form><!-- /.form-search -->
                        </div><!-- /.top-search -->
                    </div><!-- /.col-md-6 -->
                    <div class="col-md-3">
                        <div class="box-cart">
                            <div class="inner-box">
                                <ul class="menu-compare-wishlist">

                                </ul><!-- /.menu-compare-wishlist -->
                            </div><!-- /.inner-box -->
                            <div class="inner-box">
                                <a href="/page/cart" title="">
                                    <div class="icon-cart">
                                        <img src="/images/icons/cart.png" alt="">
                                        <!--<span>4</span>-->
                                    </div>
                                    <!--<div class="price">-->
                                        <!--$0.00-->
                                    <!--</div>-->
                                </a>

                            </div><!-- /.inner-box -->
                        </div><!-- /.box-cart -->
                    </div><!-- /.col-md-3 -->
                </div><!-- /.row -->
            </div><!-- /.container -->
        </div><!-- /.header-middle -->
        <div class="header-bottom">
            <div class="container">
                <div class="row">
                    <div class="col-md-3 col-2">
                        <div id="mega-menu">
                            <div class="btn-mega"><span></span>所有分类</div>
                            <ul class="menu"  >
                                <li th:each="category:${categories}">
                                    <a th:href="'/page/food?categoryId=' + ${category.id}" title="" class="dropdown">
                                        <span class="menu-title" th:text="${category.title}"></span>
                                    </a>
                                </li>

                            </ul><!-- /.menu -->
                        </div><!-- /.mega-menu -->
                    </div><!-- /.col-md-3 -->
                    <div class="col-md-9 col-10">
                        <div class="nav-wrap">
                            <div id="mainnav" class="mainnav">
                                <ul class="menu">
                                    <li class="column-1">
                                        <a href="/page/index" title="">首页</a>
                                    </li><!-- /.column-1 -->

                                    <li class="column-1">
                                        <a href="/page/recipes" title="">新闻</a>
                                    </li><!-- /.column-1 -->
                                    <li class="column-1">
                                        <a href="/page/training" title="">代练</a>
                                    </li><!-- /.column-1 -->
                                </ul><!-- /.menu -->
                            </div><!-- /.mainnav -->
                        </div><!-- /.nav-wrap -->
                        <div class="today-deal">
                            <a href="/page/cart" title="">购物车</a>
                        </div><!-- /.today-deal -->
                        <div class="btn-menu">
                            <span></span>
                        </div><!-- //mobile menu button -->
                    </div><!-- /.col-md-9 -->
                </div><!-- /.row -->
            </div><!-- /.container -->
        </div><!-- /.header-bottom -->
    </section><!-- /#header -->


</div>
</body>
</html>